<template>
	<view class="container">
		<u-form ref="form" :model="formData">
			<!-- 股票名称 -->
			<u-form-item label="股票名称" prop="name" required>
				<u-input v-model="formData.name" placeholder="请输入股票名称" />
			</u-form-item>

			<!-- 买入记录区域 -->
			<view class="trade-section">
				<text class="section-title">买入记录</text>
				<view v-for="(buy, index) in formData.buys" :key="index" class="trade-item">
					<u-form-item label="价格" :prop="'buys.' + index + '.price'" required>
						<u-input v-model="buy.price" type="number" placeholder="请输入买入价格" />
					</u-form-item>
					<u-form-item label="数量" :prop="'buys.' + index + '.quantity'" required>
						<u-input v-model="buy.quantity" type="number" placeholder="请输入买入数量" />
					</u-form-item>
					<u-button @click="removeTrade('buys', index)" type="error" size="mini" v-if="index > 0">删除</u-button>
				</view>
				<u-button @click="addTrade('buys')" type="default" size="small" style="margin-top: 10rpx;">+ 添加买入记录</u-button>
			</view>

			<!-- 卖出记录区域 -->
			<view class="trade-section">
				<text class="section-title">卖出记录</text>
				<view v-for="(sell, index) in formData.sells" :key="index" class="trade-item">
					<u-form-item label="价格" :prop="'sells.' + index + '.price'" required>
						<u-input v-model="sell.price" type="number" placeholder="请输入卖出价格" />
					</u-form-item>
					<u-form-item label="数量" :prop="'sells.' + index + '.quantity'" required>
						<u-input v-model="sell.quantity" type="number" placeholder="请输入卖出数量" />
					</u-form-item>
					<u-button @click="removeTrade('sells', index)" type="error" size="mini" v-if="index > 0">删除</u-button>
				</view>
				<u-button @click="addTrade('sells')" type="default" size="small" style="margin-top: 10rpx;">+ 添加卖出记录</u-button>
			</view>

			<u-button type="primary" @click="submitForm" style="margin-top: 30rpx;">保存记录</u-button>
		</u-form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				formData: {
					name: '',
					buys: [{}], // 默认一条买入记录
					sells: [{}] // 默认一条卖出记录
				},
			}	
		},
		onLoad(options) {
			// 从详情页跳转时携带股票ID和交易类型
			this.stockId = options.id;
			this.tradeType = options.type; // 'buy' 或 'sell'
			// 如果是从详情页跳转，初始化交易记录
			if (this.stockId) {
				// 从store获取股票信息
				const stock = this.$store.state.stockRecords.find(item => item.id === this.stockId);
				if (stock) {
					this.formData.name = stock.name;
					this.formData.name = stock.name;
					this.formData.buys = [...stock.buys];
					this.formData.sells = [...stock.sells];
				}
			}
		},
		methods: {
			// 添加交易记录
			addTrade(type) {
				this.formData[type].push({});
			},
			// 删除交易记录
			removeTrade(type, index) {
				if (this.formData[type].length > 1) {
					this.formData[type].splice(index, 1);
				}
			},
			submitForm() {
				this.$refs.form.validate(valid => {
					if (valid) {
						if (this.stockId) {
							// 从详情页跳转，更新交易记录
							const trade = this.tradeType === 'buy' ? this.formData.buys[this.formData.buys.length - 1] : this.formData.sells[this.formData.sells.length - 1];
							this.$store.dispatch('updateStockTrade', {
								id: this.stockId,
								type: this.tradeType,
								trade
							}).then(() => {
								uni.showToast({ title: '添加成功' });
								setTimeout(() => uni.navigateBack(), 1500);
							});
						} else {
							// 新增股票记录
							this.$store.dispatch('saveStockRecord', this.formData).then(() => {
								uni.showToast({ title: '保存成功' });
								setTimeout(() => uni.navigateBack(), 1500);
							});
						}
					}
				});
			}
		}
	};
</script>

<style lang="scss" scoped>
	.container {
		padding: 30rpx;
		background: #f5f5f5;
		min-height: 100vh;

		.u-form-item {
			margin-bottom: 30rpx;
			background: #fff;
			padding: 20rpx;
			border-radius: 12rpx;
		}
	}
</style>